<template>
  <a-row
    :gutter="config.gutter"
    :justify="config.justify"
    :align="config.align"
    :wrap="config.wrap"
  >
    <template v-for="(col, index) in item.formList" :key="index">
      <grid-col-container
        v-model:list="col.formList"
        v-model:model="formModel"
        :id="col.id"
        :item="col"
        :item-config="col.itemConfig"
        :config="col.config"
      />
    </template>
  </a-row>
</template>

<script lang="ts" setup>
import { defineModel, defineProps } from 'vue';
import GridColContainer from '@/components/form-render/container-item/grid-col-container.vue';

const formModel = defineModel();

const props = defineProps({
  id: {
    type: String,
    default: () => ''
  },
  item: {
    type: Object,
    default: () => {
    }
  },
  itemConfig: {
    type: Object,
    default: () => {
    }
  },
  config: {
    type: Object,
    default: () => {
    }
  }
});
</script>

<script lang="ts">
export default {
  name: 'GridRowContainerRender'
};
</script>

<style scoped>

</style>